﻿<!DOCTYPE html>
<html lang="en">
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
	<meta charset="UTF-8">
	<title>Chinese tea - China All Things Media</title>
	<script src="/assets/js/jquery-1.11.2.min.js"></script>
	<script src="/assets/js/resp.js"></script>
	<link rel="stylesheet" href="/assets/css/index.css">
	<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"> 
</head>
<body>
	<div class="content">
		<div class="container">
		<!-- 第一块视频 -->
		<div class="video">
			<video id="video" poster="/assets/img/index7/10.jpg">
				<source src="/assets/img/index7/v1.mp4" type="">
			</video>
			<div><i class="fa fa-play-circle" onclick="video();"></i>Chinese beauty teach you how to make tea</div>
		</div>
		<!-- 第二块China from above -->
		<div class="from">
			<div class="from_top">
				 CHINA FROM ABOVE 
				<a href="{:U('Art/index', array('rtype' => $list1[0]['rtype']))}">
				<i class="fa fa-chevron-circle-right"></i>
			    </a>
			</div>			
			<div class="from_bottom">
				
					<div class="bottom_item">
					    <a href="{:U('Art/article', array('arid' => $list_t1['0']['id']))}"> 
						    <img src="{$list_t1['0']['thumbimg']}"/>
						    <p>{$list_t1['0']['title']}</p>
					    </a>
					</div>					
				<volist name="list1" id="vo">
					<div class="bottom_item">
					    <a href="{:U('Art/article', array('arid' => $vo['id']))}"> 
						    <img src="{$vo.thumbimg}"/>
						    <p>{$vo['title'] |msubstr=0,18,'utf-8',true}</p>
					    </a>
					</div>
				</volist>		

			</div>
		</div>
        	<!--中国推介  -->
		<div class="tourism recommend">
		  <div class="from_top">
			 ENDORSING CHINA
			<a href="{:U('Art/index', array('rtype' => $list6[0]['rtype']))}">
			<i class="fa fa-chevron-circle-right"></i>
			</a>
		  </div>
		  <div class="scenery">
				<volist name="list6" id="vo">
				  	 <div class="scenery_item">
				  	    <a href="{:U('Art/article', array('arid' => $vo['id']))}">
				  	 	<img src="{$vo.thumbimg}">
				  	 	<p>{$vo.title}</p> 
				  	 	</a>	
				  	 </div>
				</volist>
		  </div>
		</div>	
		<!-- 第三块China tea culture -->
		<!-- <div class="culture">
			<div class="from_top">
				 Chinese tea culture 
				<a href="{:U('Art/index', array('rtype' => $list2[0]['rtype']))}">
				<i class="fa fa-chevron-circle-right"></i>
				</a>
			</div>
			<div class="from_center">
			    <a href="{:U('Art/article', array('arid' => $list2[0]['id']))}">
				 <img src="{$list2[0]['thumbimg']}">
				</a>
			</div>
			<p><a href="#">{$list2[0]['content'] |msubstr=0,100,'utf-8',true}</a></p>
			<p><a href="#">{$list2[0]['title'] |msubstr=0,100,'utf-8',true}</a></p>
			<p><a href="#">Tea is an important part of Chinese tradition.</a></p>
		</div>  -->
		<div class="culture">
			<div class="from_top">
				DIVERSE CULTURES IN CHINA 
				<a href="{:U('Art/index', array('rtype' => $list2[0]['rtype']))}">
				<i class="fa fa-chevron-circle-right"></i>
			    </a>
			</div>			
			<div class="from_bottom">
				<volist name="list2" id="vo">
					<div class="bottom_item">
					    <a href="{:U('Art/article', array('arid' => $vo['id']))}">
						    <img src="{$vo.thumbimg}"/>
						    <p>{$vo['title'] |msubstr=0,18,'utf-8',true}</p>
					    </a>
					</div>
				</volist>
			</div>
		</div>
	
		<!-- 第四块Chinese kungfu -->
		<div class="kungfu">
			<div class="from_top">
				ARTS & LIFE IN CHINA
				<a href="{:U('Art/index', array('rtype' => $list3[0]['rtype']))}">
				<i class="fa fa-chevron-circle-right"></i>
				</a>
			</div>
			<div class="classify">
				<volist name="list3" id="vo">
					<div class="classify_item">
					    <a href="{:U('Art/article', array('arid' => $vo['id']))}">
						<img src="{$vo.thumbimg}">
						<p>{$vo.title}</p>
						</a>
					</div>
				</volist>	
			</div>
		</div>
		<!-- 第五块Chinese Tourism -->
		<div class="tourism">
		  <div class="from_top">
			TRAVEL IN CHINA 
			<a href="{:U('Art/index', array('rtype' => $list4[0]['rtype']))}">
			<i class="fa fa-chevron-circle-right"></i>
			</a>
		  </div>
		  <div class="scenery">
				<volist name="list4" id="vo">
				  	 <div class="scenery_item">
				  	    <a href="{:U('Art/article', array('arid' => $vo['id']))}">
				  	 	<img src="{$vo.thumbimg}">
				  	 	<p>{$vo.title}</p> 
				  	 	</a>	
				  	 </div>
				</volist>
		  </div>
		</div>		
			<!-- 第六块Chinese Food -->
		<div class="food">
		  <div class="from_top">
			AUTHENTIC CHINESE CUISINE
			<a href="{:U('Art/index', array('rtype' => $list5[0]['rtype']))}">
			<i class="fa fa-chevron-circle-right"></i>
			</a>
		  </div>
		  <div class="scenery">
			<volist name="list5" id="vo">
		  	 <div class="scenery_item">
		  	    <a href="{:U('Art/article', array('arid' => $vo['id']))}">
		  	 	<img src="{$vo.thumbimg}">
		  	 	<p>{$vo.title}</p> 
		  	 	</a>
		  	 </div>
		  	</volist> 
		  </div>
		</div>
    </div>
</div>
</body>
	<script>
		function video(){
			var video=document.getElementById("video");	
			console.log(video);	
			if(video.controls=true){
				$("video")[0].play();
                $(".video>div").hide();
                // setTimeout(function(){
                //     $(".video>div").show();
                //     video.controls=false;
                // },5400);            
			}
			
		}
	</script>
</html>